<!--
/**
 * 存放位置 列表页 JS 脚本
 * @author 金杰 , maillank@qq.com
 * @since 2021-10-12 12:47:14
 */
 -->
<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta charset="utf-8"/>
    <title th:text="${lang.translate('主机资源')}">主机资源</title>
    <link th:if(theme.ico!="null") rel="shortcut icon" th:href="${theme.ico}" type="image/vnd.microsoft.icon">
    <link th:if(theme.ico!="null") rel="icon" th:href="theme.ico" type="image/vnd.microsoft.icon">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="/assets/libs/layui/css/layui.css" th:href="'/assets/libs/layui/css/layui.css?'+${cacheKey}"/>
    <link rel="stylesheet" href="/assets/css/admin.css" th:href="'/assets/css/admin.css?'+${cacheKey}"/>
    <link rel="stylesheet" href="/assets/libs/toast/css/toast.css" type="text/css" th:href="'/assets/libs/toast/css/toast.css?'+${cacheKey}">
    <link rel="stylesheet" href="/assets/css/foxnic-web.css" th:href="'/assets/css/foxnic-web.css?'+${cacheKey}">
    <link href="/assets/libs/font-awesome-4.7.0/css/font-awesome.min.css" th:href="@{/assets/libs/font-awesome-4.7.0/css/font-awesome.min.css}" rel="stylesheet"/>
    <script th:inline="javascript">var foxnic_cachekey=[[${cacheKey}]];</script>
    <link th:if(theme.ico!="null") rel="shortcut icon" th:href="${theme.ico}" type="image/vnd.microsoft.icon">
    <link th:if(theme.ico!="null") rel="icon" th:href="theme.ico" type="image/vnd.microsoft.icon">
    <link th:each="css:${theme.css}" rel="stylesheet" th:href="${css}+'?'+${cacheKey}">
    <link rel="stylesheet" href="/assets/libs/zTree/css/zTreeStyle/zTreeStyle.css" type="text/css">
    <style>
        .top-container {
            display: -webkit-flex; /* Safari */
            display: flex;
            width: 100%;
            align-items:top;
        }
        .left-tree {
            width: 260px;
            background-color: #ffffff;
            border-right: 1px #e6e6e6 solid;
        }
        .right-tab {
            flex:1 ;
        }
    </style>
</head>


<body>


<div class="top-container">
    <div class="left-tree">
<!--        <div class="layui-form toolbar" style="padding:6px; border-bottom:1px #e6e6e6 solid; " id="toolbar">-->
<!--            <table style="width: 100%"><tr>-->
<!--                <td>-->
<!--                    <input id="search-input" class="layui-input search-input" type="text" placeholder="请输入关键字" style="width: 100%"/>-->
<!--                </td>-->

<!--            </tr></table>-->
<!--        </div>-->
        <div id="tree-container" style="overflow:auto;">
            <ul id="menu-tree" class="ztree"></ul>
        </div>
    </div>
    <div class="right-tab" style="margin-left: 8px;margin-right: 8px" >
        <div style="margin-top:6px;">
            <iframe id="chartList" th:src="'/business/ops/monitor_node_resource/monitor_node_collect_data_graph.html?nodeId=none'" frameborder=0 width="100%" ></iframe>
        </div>
    </div>
</div>
<script>
    function changeFrameHeight(){
        var ifm= document.getElementById("chartList");
        ifm.height=document.documentElement.clientHeight-56;
        console.log("ifm.height",ifm.height)
    }

    window.onresize=function(){
        changeFrameHeight();
    }
    window.onload = function () {
        $("#tree-container").height($(document).height()-56);
        changeFrameHeight();
    };
</script>

<script type="text/javascript" src="/module/global.js"></script>
<script type="text/javascript" src="/assets/libs/jquery-3.2.1.min.js"></script>
<script type="text/javascript" src="/assets/libs/toast/js/toast.js"></script>
<script type="text/javascript" src="/assets/libs/pandyle.min.js"></script>
<script type="text/javascript" src="/assets/libs/layui/layui.js"></script>
<script type="text/javascript" src="/assets/libs/zTree/js/jquery.ztree.all-3.5.min.js"></script>



<script th:inline="javascript">
    var LAYUI_TABLE_WIDTH_CONFIG = [[${pageHelper.getTableColumnWidthConfig('data-table')}]];
    var AUTH_PREFIX="eam_report_org";
</script>


<script th:src="'/business/ops/monitor_node_resource/monitor_node_host_tree.js?'+${cacheKey}"></script>
<script th:src="'/business/ops/monitor_node_resource/monitor_node_host_tree_ext.js?'+${cacheKey}"></script>

</body>
</html>